import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:flutter_shop/components/detail/crumbs.dart';
import 'package:flutter_shop/components/detail/pane.dart';
import 'package:flutter_shop/components/detail/tabbar.dart';
import 'package:flutter_shop/provide/goods_detail_provide.dart';
import 'package:provide/provide.dart';
import '../components/detail/base_info.dart';

class DetailsPage extends StatelessWidget {
  final String goodsId;
  DetailsPage({this.goodsId});

  @override
  Widget build(BuildContext context) {
    Provide.value<GoodsDetailProvider>(context).getGoodsInfo(goodsId);
    return Scaffold(
      appBar: AppBar(
        title: Text('商品详情'),
        elevation: 0.0,
        centerTitle: true,
      ),

      // 这个地方最好使用FutureBuilder 或者使用await 现在时模拟数据
      body: Provide<GoodsDetailProvider>(
        builder: (context, child, goodsDetailProvider) {
          final _goodsInfo = goodsDetailProvider.goodsInfo;
          return Stack(
            children: <Widget>[
              ListView(
                children: <Widget>[
                  GoodsBaseInfo(baseInfo: _goodsInfo),
                  Divider( height: 16.0, color: Colors.grey[200], thickness: 12.0 ),
                  Crumbs(),
                  Divider( height: 16.0, color: Colors.grey[200], thickness: 12.0 ),
                  GoodsTabbar(),
                  GoodsPane(baseInfo: _goodsInfo)
                ],
              ),
              Positioned(
                child: _fixedBottomBar(),
                bottom: 0,
              )
            ],
          );
        }
      ),
    );
  }

  Widget _fixedBottomBar () {
    return Container(
      width: ScreenUtil().setWidth(750.0),
      height: ScreenUtil().setHeight(80.0),
      child: Row(
        children: <Widget>[
          Container(
            width: ScreenUtil().setWidth(150),
            height: ScreenUtil().setHeight(80.0),
            color: Colors.white,
            alignment: Alignment.center,
            child: Icon(Icons.shopping_cart, color: Colors.pink,)
          ),
          Container(
            width: ScreenUtil().setWidth(300.0),
            height: ScreenUtil().setHeight(80.0),
            alignment: Alignment.center,
            color: Colors.green,
            child: Text('加入购物车', style: TextStyle(color: Colors.white),),
          ),
          Container(
            width: ScreenUtil().setWidth(300.0),
            height: ScreenUtil().setHeight(80.0),
            alignment: Alignment.center,
            color: Colors.orange,
            child: Text('加入购物车', style: TextStyle(color: Colors.white),),
          ),
        ],
      ),
    );
  }
}